<template>
  <div id="cubemap" v-if="mapState.showCube"></div>
  <div id="map"></div>
</template>
<script setup>
import { useInitMap } from "./hooks/useInitMap"

const { mapState } = useInitMap()
</script>
<style lang="stylus" scoped>
#map
  width 100vw
  height 100vh
  >>>.ol-scale-line
    bottom 100px
  >>>.ol-scale-line-inner
    width 60px
#cubemap
  width 100vw
  height 100vh
  .van-loading
    top 250px
    left 12px
    z-index 1
  >>>.mapboxgl-ctrl-bottom-left .mapboxgl-ctrl
    position fixed
    bottom 50px
  >>>a.mapboxgl-ctrl-logo
      display none
</style>
